<template>
	<view class="inde_box boxFormat">
		<view class="" style="height: 110rpx;">

		</view>
		<view class="index_container">
			<view class="index_container_top">
				<view class="index_title">
					首页
				</view>
				<topBar></topBar>
			</view>
			<!-- <view class="index_container_top">
				<view class="index_title">
					首页
				</view>
				<view class="index_container_top_container">
					<view class="index_container_top_container_title">
						致力于AI+电子信息大类复合型人才培养
					</view>
					<view class="index_container_top_container_welcome">
						期待您的加入
					</view>、
					<view class="redeMore" style="text-align: center;">
						<text>了解详情</text>
					</view>
				</view>
			</view> -->
			<view class="index_container_center">
				<view class="index_title">
					快捷功能
				</view>
				<view class="index_container_center_items_box">
					<uni-grid :column="3" @change="chose" class="index_container_center_items" v-if="false">
						<uni-grid-item v-for="(item, index) in listArr" :index="index" :key="index"
							class="index_container_center_item" style="width: 28%;">
							{{item.value}}
						</uni-grid-item>
					</uni-grid>
					<view class="index_container_bottom_list">
						<view class="index_container_bottom_list_item index_container_bottom_list_item1"
							@click="gotoWaterElectricityBill">
							水费
						</view>
						<view class="index_container_bottom_list_item index_container_bottom_list_item2"
							@click="gotoWaterElectricityBill">
							热水
						</view>
						<view class="index_container_bottom_list_item index_container_bottom_list_item3"
							@click="gotoWaterElectricityBill">
							电费
						</view>
						<view class="index_container_bottom_list_item index_container_bottom_list_item4"
							@click="gotoPay">
							在线缴费
						</view>
						<view class="index_container_bottom_list_item index_container_bottom_list_item5"
							@click="gotoNotice">
							管理公示
						</view>
						<view class="index_container_bottom_list_item index_container_bottom_list_item6">
							考勤记录
						</view>
					</view>
				</view>
			</view>
			<view class="">
				<view class="index_container_bottom">
					<view class="index_container_bottom_title">
						最新公告
					</view>
					<view class="index_container_bottom_notice_list">
						<view class="index_container_bottom_notice_item" v-for="(item,index) in noticeArr">
							<view class="over_text index_container_bottom_notice_item_text">
								{{item.noticeTitle}}
							</view>
							<view class="icon">
								<uni-icons type="right" size="20"></uni-icons>

							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getWxUserInfo,
		updateSchoolUser,
		changePassword,
		selectNoticeList
	} from "../../api/request.js"
	import topBar from "../../component/topBar/topBar.vue"
	export default {
		data() {
			return {
				href: 'https://uniapp.dcloud.io/component/README?id=uniui',
				noticeArr: [],
				listArr: [{

				}]
			}
		},
		components: {
			topBar
		},
		onShow() {
			const that = this
			uni.getStorage({
				key: "token",
				success(res) {
					that.getNotice()
					console.log("?????", that.getNotice, res);
				},
				fail(e) {
					uni.showToast({
						icon: "none",
						title: "暂未查询到用户信息，为您跳转登录。。。。"
					})
					setTimeout(() => {
						uni.navigateTo({
							url: "/pages/login/login"
						})
					}, 2000)
				}
			})
			uni.getStorage({
				key: "openId",
				success(res) {

				},
				fail(e) {}
			})
			let routes = getCurrentPages();
			// let curRoute = routes[routes.length - 1].route
			console.log(routes, 'let curRoute = routes[routes.length - 1].route');
		},
		onLoad() {
			this.getData()
		},
		methods: {
			async getData() {
				let data = await getWxUserInfo()
				uni.setStorage({
					key: "userInfoId",
					data: data.data.id
				})
				uni.setStorage({
					key: "dormitoryId",
					data: data.data.dormitoryId
				})
				uni.setStorage({
					key: "roomNumber",
					data: data.data.roomNumber
				})
				console.log(data, 'getWxUserInfo');
			},
			async getNotice() {
				let result = await selectNoticeList()
				console.log(result);
				this.noticeArr = result.data
			},
			gotoWaterElectricityBill() {
				uni.navigateTo({
					url: "/pages/waterElectricityBill/waterElectricityBill"
				})
			},
			gotoNotice() {
				uni.navigateTo({
					url: "/pages/notice/notice"
				})
			},
			gotoPay() {
				uni.navigateTo({
					url: "/pages/pay/pay"
				})
			},
			gotoAttendanceDataList() {
				uni.navigateTo({
					url: "/pages/attendanceList/attendanceList"
				})
			},

		}
	}
</script>

<style lang="less">
	.index_container_bottom {
		background-color: white;

		.index_container_bottom_title {
			padding: 20rpx;
			border-bottom: 1rpx solid #eee;
			width: 90%;
			margin: auto;
		}
	}

	.index_container_bottom_notice_item {
		display: flex;
		justify-content: space-around;
		align-items: center;
		padding: 6rpx;
	}

	.index_container_bottom_notice_item_text {
		padding: 10rpx 0;
		width: 90%;
		font-size: 30rpx;
	}

	.index_container_bottom_list {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.index_container_bottom_list_item {
		width: 30%;
		height: 200rpx;
		// margin-right: 20rpx;
		margin-bottom: 20rpx;
		text-align: center;
		line-height: 200rpx;
		color: white;
		font-size: 40rpx;
	}

	.index_container_bottom_list_item1 {
		background: url("../../static/bg2.png") no-repeat;
		background-size: 100% 100%;
	}

	.index_container_bottom_list_item2 {
		background: url("../../static/bg3.png") no-repeat;
		background-size: 100% 100%;
	}

	.index_container_bottom_list_item3 {
		background: url("../../static/bg4.png") no-repeat;
		background-size: 100% 100%;
	}

	.index_container_bottom_list_item4 {
		background: url("../../static/bg5.png") no-repeat;
		background-size: 100% 100%;
	}

	.index_container_bottom_list_item5 {
		background: url("../../static/bg6.png") no-repeat;
		background-size: 100% 100%;
	}

	.index_container_bottom_list_item6 {
		background: url("../../static/bg7.png") no-repeat;
		background-size: 100% 100%;
	}

	.inde_box {
		width: 100%;
		height: 100vh;

		.index_container {
			width: 90%;
			margin: auto;

			>view {
				margin-bottom: 20rpx;
			}

			.index_container_top {
				margin-bottom: 40rpx;
				// box-shadow: 0rpx 74.49rpx 126.64rpx rgba(11, 61, 212, 0.27);
				border-radius: 20rpx;
				overflow: hidden;

				.index_container_top_container {
					background: url("../../static/bg3.png") no-repeat;
					background-size: 100%;
					width: 87%;
					height: auto;
					background-size: cover;
					background-position: center;
					-webkit-transform: scale(1.1);
					transform: scale(1.1);
					padding: 20rpx;
					margin: auto;
					border-radius: 21.5rpx;
					padding-bottom: 80rpx;
					margin-top: 20rpx;

					/* 将背景图片定位到元素的中心 */
					.index_container_top_container_title {
						font-size: 28rpx;
						font-weight: 500;
						letter-spacing: 0rpx;
						line-height: 52.03rpx;
						color: rgba(255, 255, 255, 1);
						text-align: left;
						vertical-align: top;
					}

					.index_container_top_container_welcome {
						font-size: 33.68rpx;
						font-weight: 400;
						letter-spacing: 0rpx;
						line-height: 48.77rpx;
						color: rgba(255, 255, 255, 1);
						text-align: left;
						vertical-align: top;
					}
				}
			}

			.index_container_center_items {
				.index_container_center_item {
					width: 30%;
					height: 100%;
					margin: auto;
					text-align: center;
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
				}
			}


		}
	}

	.index_title {
		font-size: 40rpx;
		font-weight: 500;
		margin-bottom: 34rpx;
	}
</style>